<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <!--{include file='comm/header.tpl'}-->
    <title>用户列表</title>
    <!--{include file="comm/icheck.tpl"}-->
</head>
<body>
<!--{include file='comm/naviBanner.tpl'}-->

<div class="container">

    <!--{include file='comm/menu.tpl'}-->

        <div class="comm_crub">
            <span class="now_crub">用户列表</span>
        </div>

        <div class="comm_content">

            <div class="search-box">
                <div style="position:relative">
                    <form class="form-inline" onsubmit="return false;" id="search_form">
                        <table>
                            <tbody>
                            <tr>
                                <td height="27px">
                                    <span>用户名：<input type="text" class="form-control input-sm" style="width:148px" value="" name="userID" id="userID"></span>
                                    <span><input type="button" onclick="user.search();" class="btn btn-primary" value="查询"></span>
                                    <span><input type="button" onclick="user.reSet();" class="btn btn-warning" value="重置"></span>
                                </td>
                            </tr>
                            </tbody>
                        </table>
                    </form>
                </div>
            </div>

            <table id="flex" style="display:none;"></table>

        </div>

   

</div>
<!--HTML OPEN-->
<div style="display:none">
    //区域添加
    <div id="pop" style="display:none">
        <div class="navigation" id="navigation" style="margin-bottom: 13px;">
            <ul class="nav nav-tabs">
                <li class="active" onclick="user.changed(this,'add_user');"><a href="#">用户信息</a></li>
                <li onclick="user.changed(this,'add_role');"><a href="#">用户角色</a></li>
            </ul>
        </div>
        <div id="select-content">
            <form id="userForm" class="form-horizontal" role="form" onsubmit="return false;">
                <input type="hidden" id="uuid" name="uuid" value="" />
                <div id="add_user">
                    <div class="form-group">
                        <label for="userId" class="col-sm-2 control-label"><span style="color:red;">*</span>&nbsp;用户名：</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" id="userId" name="userID" placeholder="请输入用户名" style="width: 350px"/>
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="trueName" class="col-sm-2 control-label"><span style="color:red;">*</span>&nbsp;用户姓名：</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" id="trueName" name="trueName" placeholder="请输入用户姓名" style="width: 350px"/>
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="userPwd" class="col-sm-2 control-label"><span style="color:red;">*</span>&nbsp;密码：</label>
                        <div class="col-sm-10">
                            <input type="password" class="form-control" id="userPwd" name="userPwd" placeholder="请输入密码" style="width: 350px"/>
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="repeatPwd" class="col-sm-2 control-label"><span style="color:red;">*</span>&nbsp;密码确认：</label>
                        <div class="col-sm-10">
                            <input type="password" class="form-control" id="repeatPwd" name="repeatPwd" placeholder="请再次输入密码" style="width: 350px"/>
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="email" class="col-sm-2 control-label"><span style="color:red;">*</span>&nbsp;email：</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" id="email" name="email" placeholder="请输入邮箱地址" style="width: 350px"/>
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="departmentID" class="col-sm-2 control-label">部门：</label>
                        <div class="col-sm-10">
                            <select class="form-control" id="departmentID" name="departmentID" style="width: 350px">
                                <option value="0">请选择</option>
                                <!--{$department_select_html}-->
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">城市：</label>
                        <div class="col-sm-10">
                            <!--{foreach from=$city_array item=city}-->
                            <div class="fl" style="margin: 0px 10px 10px 0px;">
                                <input type="checkbox" class="square-radio" id="city-checkbox-<!--{$city.id}-->" name="cityID" value="<!--{$city.id}-->">
                                <label for="city-checkbox-<!--{$city.id}-->"><!--{$city.name}--></label>
                            </div>
                            <!--{/foreach}-->
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">配送站：</label>
                        <div class="col-sm-10">
                            <!--{foreach from=$distribution_array item=distribution}-->
                            <div class="fl" style="margin: 0px 10px 10px 0px;">
                                <input type="checkbox" class="square-radio" id="distribution-checkbox-<!--{$distribution.id}-->" name="distributionID" value="<!--{$distribution.id}-->">
                                <label for="distribution-checkbox-<!--{$distribution.id}-->"><!--{$distribution.name}--></label>
                            </div>
                            <!--{/foreach}-->
                        </div>
                    </div>
                </div>
                <div id="add_role" class="hidden">
                    <!--{foreach from=$role_group_array item=group}-->
                    <div class="form-group">
                        <label class="col-sm-2 control-label"><!--{$group.roleGroupName}--></label>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-1 control-label"></label>
                        <div class="col-sm-10">
                            <!--{foreach from=$group.role_list item=role_list}-->
                            <div class="fl" style="margin: 0px 10px 10px 0px;">
                                <input type="checkbox" class="square-radio" id="square-checkbox-<!--{$role_list.roleID}-->" name="user_role" value="<!--{$role_list.roleID}-->">
                                <label for="square-checkbox-<!--{$role_list.roleID}-->"><!--{$role_list.roleName}--></label>
                            </div>
                            <!--{/foreach}-->
                        </div>
                    </div>
                    <!--{/foreach}-->
                </div>
            </form>
        </div>
    </div>
</div>

<!--END HTML OPEN-->
<script type="text/javascript">
$(window).ready(function() {

    $("#roleGroupID").on("change", function() {

        var group_id = $(this).val();
        $("#roleID").find("option").show();
        if (group_id > 0) {
            $.each($("#roleID").find("option"), function(k, v) {
                if ($(v).attr("group") != group_id) {
                    $(v).hide();
                }
            });
        }

    });

});
$("#flex").flexigrid({
    url:"/invokingAjax-backend/user/userList.ajax?operFlg=1&xjx=none",
    dataType: "json",
    colModel : [
        <!--{if $edit_permission}-->
        {display: "操作", width : 120, align: 'center'},
        <!--{/if}-->
        {display: "用户名", width : 120},
        {display: "用户姓名", width : 120},
        {display: "email", width : 200},
        {display: "门店", width : 120},
        {display: "使用标志", width : 70, align: 'center'}
    ],
    <!--{if $edit_permission}-->
    buttons : [
        {name: "添加", bclass: "add", onpress : "user.edit"},
        {separator: true},
        {name: "删除", bclass: "delete", onpress : "user.del.check"},
        {separator: true},
        {name: "全选", bclass: "checkAll", onpress : "E.checkAllList"},
        {separator: true},
        {name: "取消全选", bclass: "cancelCheckAll", onpress : "E.cancelCheckAllList"}

    ],
    <!--{/if}-->
    sortname: "createTime",
    sortorder: "desc",
    usepager: true,
    rp: 10,
    useRp: true,
    showTableToggleBtn: true
});

var user = {

    operFlg:"",

    //查询
    search: function() {
        var dt = $('#search_form').serializeArray();
        $("#flex").flexOptions({newp: 1, params: dt}).flexReload();
    },

    //重置
    reSet:function(){

        $("#userID").val('');
        $("#merchantName").val('');

    },

    //清除
    clear: function(){
        $("#roleGroupID").val(0);
        $("#userID").val("");
        $("#roleID").html(0);
    },

    //编辑
    edit: function(userID) {
        this.userID = userID;
        this.operFlg = 1;
        if(userID){
            var url = '/invokingAjax-backend/user/userList.ajax?operFlg=100&userID='+userID+'&act=edit';
        }else{
            var url =  '/invokingAjax-backend/user/userList.ajax?operFlg=100&act=+edit';
        }
        E.loadding.open('正在操作，请稍候...');
        E.ajax_post({
            url: url,
            //data: {},
            call: "user.open"
        });
    },

    open: function(o){
        E.loadding.close();

        var title = "正在操作：用户修改";

        if(o.editData == undefined){
            title = "正在操作：用户添加";
            this.addBox = 'add_user';
        }
        E.popup.open({
            id:"pop",   		 //获取id为"pop"元素内的HTML
            title: title,       //弹出层标题
            css: "width:800px;",     //设置弹出层样式
            btnName: "保存",         //执行“确定”操作的按钮名称
            btnCall:"user.check();"  //点击确定后执行的方法
        });
        $('.square-radio').iCheck({
            checkboxClass: 'icheckbox_square-blue',
            radioClass: 'iradio_square-blue',
            increaseArea: '20%' // optional
        });
        if(user.operFlg == 2){
            $(".nav-tabs li:eq(1)").addClass("active");
            $(".nav-tabs li:eq(1)").siblings().removeClass("active");
            $("#add_user").addClass("hidden");
            $("#add_role").removeClass("hidden");
        }else{
            $(".nav-tabs li:eq(0)").addClass("active");
            $(".nav-tabs li:eq(0)").siblings().removeClass("active");
            $("#add_user").removeClass("hidden");
            $("#add_role").addClass("hidden");
        }

        if(o.editData != undefined){

            $.each(o.editData,function(k,v){
                $('#uuid').val(v.uuid);
                $('#userId').val(v.userID).attr('disabled','disabled');
                $('#trueName').val(v.trueName);
                $('#email').val(v.email);
                $('#departmentID').val(v.departmentID);
            });

            $.each(o.cityID,function(k,c){
                $("#city-checkbox-"+c).iCheck('check')
            });

            $.each(o.distributionID,function(k,d){
                $("#distribution-checkbox-"+d).iCheck('check')
            });

            $.each(o.user_role,function(key,v){
                $("#square-checkbox-"+v).iCheck('check')
            });

        }
    },

    check: function(){
        this.dt = E.getFormValues("userForm");
        var msg = '';

        if (E.isEmpty(this.dt.userID)) {
            msg += "用户名不能为空<br>";
        }
        if (E.isEmpty(this.dt.trueName)) {
            msg += "用户姓名不能为空<br>";
        }
        if (!this.userID || (this.userID && !E.isEmpty(this.dt.userPwd))) {
            if (!E.isPwd(this.dt.userPwd)) {
                msg += "密码必须是6-30位字符，可使用字母、数字或符号的组合<br>";
            }
            if (this.dt.userPwd != this.dt.repeatPwd) {
                msg += "两次输入的密码不一致<br>";
            }
        }
        if (!E.isEmail(this.dt.email)) {
            msg += "邮件不能为空或格式错误<br>";
        }
        if (this.dt.user_role.length == 0) {
            msg += "请选择用户角色<br>";
        }
        if (msg != "") {
            E.alert(msg);
        } else {
            E.confirm("您确认要保存用户信息吗？", "user.save");
        }
    },
    save: function() {

        E.popup.close();

        E.loadding.open("正在保存用户信息，请稍候...");
        E.ajax_post({
            url: "/invokingAjax-backend/user/userList.ajax?operFlg=2",
            data: this.dt,
            call: "user.result"
        })
    },
    result: function( o ) {

        if (o.code == 200) {
            E.alert(o.message, 2, "user.load");
        } else {
            E.alert(o.message);
        }
        E.loadding.close();
    },
    load: function(){
        $("#flex").flexReload();
    },

    //角色分配
    role: function( userID ) {
        this.userID = userID;
        this.operFlg = 2;
        var url = '/invokingAjax-backend/user/userList.ajax?operFlg=100&userID='+userID+'&act=edit';
        E.loadding.open('正在操作，请稍候...');
        E.ajax_post({
            url: url,
            //data: {},
            call: "user.open"
        });
    },

    change: {

        userID: "",
        useFlg: "",

        test:function(){
            alert()
        },

        confirm: function(userID, useFlg) {
            this.userID = userID;
            this.useFlg = useFlg;
            if (useFlg == 0) {
                E.confirm("您确认要禁用该用户吗？", "user.change.execute");
            } else {
                E.confirm("您确认要启用该用户吗？", "user.change.execute");
            }
        },

        execute: function() {
            if (this.useFlg == 0) {
                E.loadding.open("正在禁用用户，请稍候...");
            } else {
                E.loadding.open("正在启用用户，请稍候...");
            }
            E.ajax_get({
                url: "/invokingAjax-backend/user/userList.ajax?operFlg=100&act=change",
                data: {
                    userID: this.userID,
                    useFlg: this.useFlg
                },
                call: "user.change.result"
            });
        },

        result: function( o ) {
            E.loadding.close();
            if (o.code == 200) {
                user.load();
                E.alert(o.message, 2);
            } else {
                E.alert(o.message);
            }
        }

    },

    del: {

        u_array: "",

        check: function() {

            //获取选中的行的行数
            if ($('.trSelected',flex).length == 0) {

                E.alert('请选择要删除的用户');

            } else {

                this.u_array = new Array();

                $.each($('.trSelected',flex), function(k, v) {
                    user.del.u_array.push($(v).attr("id").substr(3));
                });

                //弹出确认层
                E.confirm("您确认要删除选择的用户吗？", "user.del.execute");

            }

        },

        execute: function() {

            E.loadding.open("正在删除用户，请稍候...");
            E.ajax_post({
                url: "/invokingAjax-backend/user/userList.ajax?operFlg=100&act=del",
                data: {
                    user_arry: this.u_array
                },
                call: "user.del.result"
            });

        },

        result: function( o ) {
            E.loadding.close();
            if (o.code == 200) {
                user.load();
                E.alert(o.message, 2);
            } else {
                E.alert(o.message);
            }
        }

    },
    changed: function(ythis,boxID){

        this.addBox = boxID;

        $(ythis).addClass('active').siblings().removeClass('active');

        $('#'+boxID.toString()).removeClass('hidden').siblings().addClass('hidden');

    },

};

</script>

</body>

</html>